{extend name='common/base'}

{block name="cs"}
    <link rel="stylesheet" href="/static/admin/js/plugins/layui/css/layui.css">
    <script src="/static/admin/js/jquery.min.js?v=2.1.4"></script>

    <script src="/static/admin/js/plugins/layui/layui.js"></script>
{/block}

{block name="content"}
<div class="animated fadeIn">
    <div class="row">
        <div class="col-sm-12">
            <div class="ibox float-e-margins">
                <div class="ibox-title">
                    <h5>系统配置</h5>
                </div>
                <div class="ibox-content">
                    <div class="row">
                        <div class="col-sm-12">
                            <div class="panel blank-panel">

                                <div class="panel-heading">
                                    <div class="panel-options">

                                        <ul class="nav nav-tabs">
                                            {volist name="config_group_list" id="group"}
                                                <li {eq name="id" value="$key"}class="active"{/eq}>
                                                    <a  href="{:url('?id='.$key)}" aria-expanded="true">
                                                        {$group}
                                                    </a>

                                                </li>
                                            {/volist}

                                            <li class=""><a data-toggle="tab" href="tabs_panels.html#tab-7" aria-expanded="false"><i class="fa fa-plus"></i></a>
                                            </li>
                                        </ul>
                                    </div>
                                </div>

                                <div class="panel-body">
                                    <div class="row">
                                        <div class="col-xs-12">
                                            <form class="form-horizontal" method="post" >
                                        {volist name="list" id="config"}
                                        <div class="form-group">
                                            <label class="col-sm-2 control-label">{$config.title}：</label>
                                            <div class=" col-sm-4">
                                                {switch name="config.type"}

                                                    {case value="text"}
                                                        <!--文本-->
                                                        <input type="text" class="form-control" name="config[{$config.name}]" value="{$config.value}">
                                                        <span class="help-block m-b-none"><i class="fa fa-info-circle"></i> {$config.remark}</span>
                                                    {/case}
                                                    <!--数字-->
                                                    {case value="number"}
                                                        <input type="number" class="form-control" name="config[{$config.name}]" value="{$config.value}">
                                                        <span class="help-block m-b-none"><i class="fa fa-info-circle"></i> {$config.remark}</span>
                                                    {/case}
                                                    <!--只读-->
                                                    {case value="readonly"}
                                                        <input type="text" readonly class="form-control" name="config[{$config.name}]" value="{$config.value}">
                                                        <span class="help-block m-b-none"><i class="fa fa-info-circle"></i> {$config.remark}</span>
                                                    {/case}
                                                    <!--多行文本-->
                                                    {case value="textarea"}
                                                        <textarea name="config[{$config.name}]" cols="75" rows="6">{$config.value}</textarea>
                                                        <span class="help-block m-b-none"><i class="fa fa-info-circle"></i> {$config.remark}</span>
                                                    {/case}

                                                    {case value="password"}
                                                        <input type="password" readonly class="form-control" name="config[{$config.name}]" value="{$config.value}">
                                                        <span class="help-block m-b-none"><i class="fa fa-info-circle"></i> {$config.remark}</span>
                                                    {/case}
                                                    <!--单选-->
                                                    {case value="radio"}
                                                        <div class="input-group col-sm-12">
                                                            {volist name=":parse_config_attr($config['options'])" id="vo"}
                                                                <div class="radio i-checks col-sm-3">
                                                                    <label>
                                                                        <input type="radio" value="{$key}" {if condition="$key == 1 " }checked{/if} name="config[{$config.name}]"> <i></i> {$vo}</label>
                                                                </div>
                                                            {/volist}
                                                        </div>
                                                    <span class="help-block m-b-none"><i class="fa fa-info-circle"></i> {$config.remark}</span>
                                                    {/case}
                                                    <!--多选-->
                                                    {case value="checkbox"}
                                                        <div class="input-group col-sm-12">
                                                            {volist name=":parse_config_attr($config['options'])" id="vo"}
                                                                <div class="checkbox-inline i-checks col-sm-3">
                                                                    <label>
                                                                        <input type="checkbox" value="{$key}" {if condition="$key == 1 " }checked{/if} name="config[{$config.name}]"> <i></i> {$vo}</label>
                                                                </div>
                                                            {/volist}
                                                        </div>
                                                        <span class="help-block m-b-none"><i class="fa fa-info-circle"></i> {$config.remark}</span>
                                                    {/case}
                                                    <!--下拉-->
                                                    {case value="select"}
                                                        <select class="form-control m-b chosen-select" name="config[{$config.name}]">
                                                            {volist name=":parse_config_attr($config['options'])" id="vo"}
                                                            <option value="{$key}" {eq name="config.value" value="$key"}selected{/eq}>{$vo}</option>
                                                            {/volist}
                                                        </select>
                                                        <span class="help-block m-b-none"><i class="fa fa-info-circle"></i> {$config.remark}</span>
                                                    {/case}

                                                    {case value="array"}
                                                        <textarea name="config[{$config.name}]" cols="75" rows="6">{$config.value}</textarea>
                                                        <span class="help-block m-b-none"><i class="fa fa-info-circle"></i> {$config.remark}</span>
                                                    {/case}
                                                    <!--单文件-->
                                                    {case value="file"}
                                                    <input id="f_upload" type="file" class="file" multiple data-show-upload="false" data-show-caption="true" data-show-preview="true" showBrowse="true" />
                                                <!--<input id="input-2" name="input2" type="file fileloading" class="file" multiple-->
                                                       <!--readonly="false" disabled="false"  data-show-upload="false" data-show-caption="true" data-show-preview="true" data-allowed-file-extensions='["jpg","png"]'>-->
                                                <script>
                                                    $(".file").fileinput({
                                                        uploadUrl:"<%=basePath%>uploadFile",//上传的地址
                                                        uploadAsync:false, //默认异步上传
                                                        showUpload: true, //是否显示上传按钮,跟随文本框的那个
                                                        showRemove : true, //显示移除按钮,跟随文本框的那个
                                                        showCaption: true,//是否显示标题,就是那个文本框
                                                        showPreview : true, //是否显示预览,不写默认为true
                                                        dropZoneEnabled: true,//是否显示拖拽区域，默认不写为true，但是会占用很大区域
                                                        //minImageWidth: 50, //图片的最小宽度
                                                        //minImageHeight: 50,//图片的最小高度
                                                        //maxImageWidth: 1000,//图片的最大宽度
                                                        //maxImageHeight: 1000,//图片的最大高度
                                                        //maxFileSize: 0,//单位为kb，如果为0表示不限制文件大小
                                                        //minFileCount: 0,
                                                        maxFileCount: 1, //表示允许同时上传的最大文件个数
                                                        //enctype: 'multipart/form-data',
                                                        validateInitialCount:true,
                                                        previewFileIcon: "<i class='glyphicon glyphicon-king'></i>",
                                                        msgFilesTooMany: "选择上传的文件数量({n}) 超过允许的最大数值{m}！",
                                                        allowedFileTypes: ['text'],//配置允许文件上传的类型
                                                        allowedPreviewTypes : [ 'text'],//配置所有的被预览文件类型
//                                                        allowedPreviewMimeTypes : [ 'jpg', 'png', 'gif' ,'txt'],//控制被预览的所有mime类型
                                                        language : 'zh'
                                                    })
                                                    //异步上传返回结果处理
                                                    $('.myfile').on('fileerror', function(event, data, msg) {
                                                        console.log("fileerror");
                                                        console.log(data);
                                                    });
                                                    //异步上传返回结果处理
                                                    $(".myfile").on("fileuploaded", function (event, data, previewId, index) {
                                                        console.log("fileuploaded");
                                                        var ref=$(this).attr("data-ref");
                                                        $("input[name='"+ref+"']").val(data.response.url);

                                                    });

                                                    //同步上传错误处理
                                                    $('.myfile').on('filebatchuploaderror', function(event, data, msg) {
                                                        console.log("filebatchuploaderror");
                                                        console.log(data);
                                                    });

                                                    //同步上传返回结果处理
                                                    $(".myfile").on("filebatchuploadsuccess", function (event, data, previewId, index) {
                                                        console.log("filebatchuploadsuccess");
                                                        console.log(data);
                                                    });

                                                    //上传前
                                                    $('.myfile').on('filepreupload', function(event, data, previewId, index) {
                                                        console.log("filepreupload");
                                                    });
                                                </script>
                                                    {/case}
                                                    <!--日期-->
                                                    {case value="date"}
                                                     <input type="text" class="form-control layui-date " name="" value=""   autocomplete="off" placeholder="" id="a{$config.id}">
                                                <span class="help-block m-b-none"><i class="fa fa-info-circle"></i> {$config.remark}</span>
                                                            <script type="text/javascript">
                                                                layui.use(['jquery', 'laydate', 'upload'], function() {
                                                                    var laydate=layui.laydate;
                                                                    laydate.render({
                                                                        elem: '#a{$config.id}'
                                                                        ,type:'date'
                                                                    });
                                                                });
                                                            </script>
                                                    {/case}
                                                    <!--时间-->
                                                    {case value="time"}
                                                    <input type="text" class="form-control layui-date " name="" value=""   autocomplete="off" placeholder="" id="a{$config.id}">
                                                    <script type="text/javascript">
                                                        layui.use(['jquery', 'laydate', 'upload'], function() {
                                                            var laydate=layui.laydate;
                                                            laydate.render({
                                                                elem: '#a{$config.id}'
                                                                ,type:'time'
                                                            });
                                                        });
                                                    </script>
                                                    {/case}
                                                     <!--日期+时间-->
                                                    {case value="datetime"}
                                                    <input type="text" class="form-control layui-date " name="" value=""   autocomplete="off" placeholder="" id="a{$config.id}">
                                                    <script type="text/javascript">
                                                        layui.use(['jquery', 'laydate', 'upload'], function() {
                                                            var laydate=layui.laydate;
                                                            laydate.render({
                                                                elem: '#a{$config.id}'
                                                                ,type:'datetime'
                                                            });
                                                        });
                                                    </script>
                                                    {/case}

                                                    <!--日期范围选择-->
                                                    {case value="daterange"}
                                                    <input type="text" class="form-control layui-date " name="" value=""   autocomplete="off" placeholder="" id="a{$config.id}">
                                                    <script type="text/javascript">
                                                        layui.use(['jquery', 'laydate', 'upload'], function() {
                                                            var laydate=layui.laydate;
                                                            laydate.render({
                                                                elem: '#a{$config.id}'
                                                                ,type:'date'
                                                                ,range: true
                                                            });
                                                        });
                                                    </script>
                                                    {/case}

                                                    <!--时间范围选择-->
                                                    {case value="timerange"}
                                                    <input type="text" class="form-control layui-date " name="" value=""   autocomplete="off" placeholder="" id="a{$config.id}">
                                                    <script type="text/javascript">
                                                        layui.use(['jquery', 'laydate', 'upload'], function() {
                                                            var laydate=layui.laydate;
                                                            laydate.render({
                                                                elem: '#a{$config.id}'
                                                                ,type:'time'
                                                                ,range: true
                                                            });
                                                        });
                                                    </script>
                                                    {/case}

                                                    <!--日期+时间范围选择-->
                                                    {case value="datetimerange"}
                                                    <input type="text" class="form-control layui-date " name="" value=""   autocomplete="off" placeholder="" id="a{$config.id}">
                                                    <script type="text/javascript">
                                                        layui.use(['jquery', 'laydate', 'upload'], function() {
                                                            var laydate=layui.laydate;
                                                            laydate.render({
                                                                elem: '#a{$config.id}'
                                                                ,type:'datetime'
                                                                ,range: true
                                                            });
                                                        });
                                                    </script>
                                                    {/case}

                                                {/switch}
                                            </div>
                                        </div>
                                        {/volist}
                                                <div class="form-group">
                                                    <div class="col-sm-4 col-sm-offset-2">
                                                        <button class="btn btn-primary" type="submit">保存</button>
                                                    </div>
                                                </div>
                                            </form>
                                        </div>
                                    </div>

                                </div>

                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

</div>
{/block}

{block name="script"}
{/block}
